<template>
  <div class="rightBodyContent">
    <div class="rightBodyContent-in">
      <el-button type="primary" plain @click="backlist" size="small"><i class="el-icon-back"></i>返回列表
      </el-button>
      <div class="hearder-search mb-20">
        <div class="breadcrumb-container input-val-box">
          <!--<el-input v-model="searchWord" placeholder="填写物料名称" @keyup.enter.native="searchBtn" size="small"-->
          <!--class="w-200 mr-10"></el-input>-->
          <!--<el-input v-model="searchWord" placeholder="填写领用人" @keyup.enter.native="searchBtn" size="small"-->
          <!--class="w-200 mr-10"></el-input>-->
          <!--<el-button type="primary" @click="searchBtn" size="small"><i class="el-icon-search"></i>搜索</el-button>-->
          <span class="allbook">总 {{page.total}} 条记录</span>
        </div>
      </div>
      <!--本体列表，数据 -->
      <el-table
              ref="multipleTable"
              :data="arryList"
              :stripe="tableStyle.tableStripe"
              :border="tableStyle.tableBorder"
              tooltip-effect="dark"
              header-cell-class-name="table-text-c"
              cell-class-name="table-text-c">
        <el-table-column
                align="center"
                label="班级">
          <template slot-scope="scope">
            <span>{{scope.row.classes.section_id}}-{{scope.row.classes.class_name}}</span>
          </template>
        </el-table-column>
        <el-table-column
                align="center"
                prop="count"
                label="预约人数">
        </el-table-column>
        <el-table-column
                align="center"
                prop="qualified"
                label="合格人数">
        </el-table-column>
        <el-table-column
                label="操作"
                width="200" align="center">
          <template slot-scope="scope">
            <el-button size="small" @click="showlist(scope.$index)">查看学生记录</el-button>
          </template>
        </el-table-column>
      </el-table>

      <!--工具条 分页-->
      <el-col :span="24" class="toolbar">
        <el-pagination
                background
                :page-size="page.pagesize"
                :current-page="page.pageindex"
                layout="total, prev, pager, next"
                :total="page.total"
                @current-change="handleSizeChange"></el-pagination>
      </el-col>
    </div>
    <div class="height40"></div>
  </div>
</template>

<script>
  import {pagination, yearDay, tableoption} from '@/utils/util.js'
  import api from '@/utils/api.js'

  export default {
    data () {
      return {
        yeartimeFn: yearDay,
        arryList: [], // 数据列表
        tableStyle: tableoption,
        // 页数
        page: {
          pageindex: pagination.pageIndex,
          pagesize: pagination.pageSize,
          total: pagination.total
        },
        ListId: this.$route.query
      }
    },
    created () {
      this.InitFn()
    },
    methods: {
      // 初始化
      InitFn () {
        // type 	整型 	必填 	1 	- 	0进货1申请
        // status 	整型 	必填 	1 	- 	类型0申请1确认2取消
        let data_ = {
          p: this.page.pageindex,
          open_id: this.ListId.id,
          corner_id: this.ListId.corner_id
        }
        this.$fetch(api.admin_corner_log_index, data_).then((response) => {
          if (response.code === 0) {
            this.arryList = response.list.data
            this.page.total = response.list.total
          } else {
          }
        }).catch((err) => {
          console.log(err)
        })
      },
      backlist () {
        this.$router.go(-1)
      },
      // 分页
      handleSizeChange (val) {
        this.page.pageindex = val
        this.InitFn()
      },
      showlist (index) {
        this.$router.push('CornerStudent?type=1&id=' + this.arryList[index].id)
      }
    },
    mounted () {
    }
  }
</script>

